{% extends 'web/layout/manage.html' %}
{% load static %}

{% block css %}
    <link rel="stylesheet" href="{% static 'web/css/wiki.css' %}">
    <link rel="stylesheet" href="{% static 'web/plugin/editor.md-master/css/editormd.preview.min.css' %}">
        <style>
        .editormd-fullscreen{
            z-index: 1007;
        }
    </style>
{% endblock %}

{% block content %}
    <div class="container-fluid project">
        <div class="panel panel-default">
              <div class="panel-heading">
                  <div>
                    <i class="fa fa-book" aria-hidden="true"></i> wiki文档
                  </div>
                  <div class="function">
                      <a type="button" class="btn btn-success btn-xs" href=
                              "{% url 'wiki_add' project_id=request.tracer.project.id %}">
                        <i class="fa fa-plus-circle" aria-hidden="true"></i> 新建
                      </a>
                      {% if wiki_object %}
                           <a type="button" class="btn btn-primary btn-xs" href=
                                   "{% url 'wiki_edit' project_id=request.tracer.project.id wiki_id=wiki_object.id %}">
                                <i class="fa fa-edit" aria-hidden="true"></i> 编辑
                           </a>
                          <a type="button" class="btn btn-danger btn-xs" href=
                                  "{% url 'wiki_delete' project_id=request.tracer.project.id wiki_id=wiki_object.id %}">
                                <i class="fa fa-trash" aria-hidden="true"></i> 删除
                           </a>
                      {% endif %}
                  </div>
              </div>
              <div class="panel-body">
                  <div class="col-sm-3 title-list">
                      <ul id="catalog">
                          <!--<li>
                              <a>目录1</a>
                              <ul>
                                  <li><a>子目录1</a></li>
                                  <li><a>子目录2</a></li>
                                  <li><a>子目录3</a></li>
                              </ul>
                          </li>
                          <li>
                              <a>目录2</a>
                          </li>
                          <li>
                              <a>目录3</a>
                              <ul>
                                  <li><a>子目录1</a></li>
                                  <li><a>子目录2</a></li>
                                  <li><a>子目录3</a></li>
                              </ul>
                          </li> -->

                      </ul>

                  </div>
                  <div class="col-sm-9 content">
                      {% if wiki_object %}
                          <div id="previewMarkdown">
                            <textarea>{{ wiki_object.content }}</textarea>
                          </div>
                      {% else %}
                          <div>
                              <h4>《{{ request.tracer.project.name }}》wiki文档库</h4>
                              <a href="{% url 'wiki_add' project_id=request.tracer.project.id %}">
                                  <i class="fa fa-plus-circle" aria-hidden="true"></i> 新建文章
                              </a>
                          </div>
                      {% endif %}
                  </div>
              </div>
        </div>
    </div>

{% endblock %}

{% block js %}
    <script src="{% static 'web/plugin/editor.md-master/editormd.min.js' %}"></script>
    <script src="{% static 'web/plugin/editor.md-master/lib/marked.min.js' %}"></script>
    <script src="{% static 'web/plugin/editor.md-master/lib/flowchart.min.js' %}"></script>
    <script src="{% static 'web/plugin/editor.md-master/lib/jquery.flowchart.min.js' %}"></script>
    <script src="{% static 'web/plugin/editor.md-master/lib/prettify.min.js' %}"></script>
    <script src="{% static 'web/plugin/editor.md-master/lib/raphael.min.js' %}"></script>
    <script src="{% static 'web/plugin/editor.md-master/lib/sequence-diagram.min.js' %}"></script>
    <script src="{% static 'web/plugin/editor.md-master/lib/underscore.min.js' %}"></script>
    <script>
    var WIKI_DETAIL_URL = "{% url 'wiki' project_id=request.tracer.project.id %}"

        $(function (){
            initCatalog();
            previewMarkdown();
        });
         function previewMarkdown(){
            editormd.markdownToHTML('previewMarkdown',{
                htmlDecode:"style,script,iframe"
            })
        }

        function initCatalog(){
            $.ajax({
                url:"{% url 'wiki_catalog' project_id=request.tracer.project.id %}",
                type:"GET",
                data:"",
                dataType:"JSON",
                success:function (res){
                    //console.log(res)
                    if(res.status){
                        $.each(res.data,function (index,item){
                            var href = WIKI_DETAIL_URL + "?wiki_id=" + item.id
                            var li = $("<li>").attr('id','id_' + item.id).append($('<a>').text(item.title).attr('href',href)).append($('<ul>'));
                            if(!item.parent_id){
                                // 生成这个标签<li><a>子目录1</a></li>，并添加到标签：<ul id="catalog">中
                                $('#catalog').append(li);
                            }else {
                                $('#id_' + item.parent_id).children('ul').append(li); // 找到父标签下面的子标签<ul>,将
                            }
                        })
                    }
                }
            })
        }
    </script>
{% endblock %}













